<template>
  <div class="mui-content " @change="test()" @click="def_bodyClick">
    <!--进入页面加载资源动画-->
    <div v-show="showme ">
      <div id="Loading">
        <div class="loader-inner ball-beat">
          <div></div>
          <div></div>
          <div></div>
        </div>
      </div>
    </div>

    <div v-show="!showme ">
      <div v-if="!regist">
        <heade background='background' :title=title v-on:goBack="goBack($event)" color1="color1"></heade>
        <div class="time" v-if="alreadyApply2" >
          距离申报结束还有：<span v-html="endTime"></span><span>天</span>
        </div>
        <div class="titleWrapper" v-if="!alreadyApply2">
          <ul>
            <li v-for="(item,index) in result" :key="index">
              <div class="left"> <span class="span"></span> <span class="span2" v-show="index!=result.length-1"></span></div>
              <div class="middle">{{item.Name}}</div>
              <div class="right">{{item.Date}}</div>
            </li>
          </ul>
        </div>
        <div class="form"  style="position: relative">
          <span @click.stop="prevent1" class="afterShow" v-show="alreadyApply3"> </span>
          <div class="info" :style="{background:isblack==1?'white':'#e2e2e7'}"><div class="infoTitle">活动名称:</div>
            <input type="text" v-model="activeName" readonly="ds" :style="{background:isblack==1?'white':'#e2e2e7'}">
            <div class="right"></div>
          </div>
          <div class="info" ><div class="infoTitle"> <span v-show="!vedioShow">论文</span>标题:</div><input type="text" v-model="activeTitle"><div class="right"></div></div>
          <div class="info" ><div class="infoTitle">填报时间:</div>
            <div class="hello mui-content">
              <input type="text" id="test" v-model="date" class="ipt" placeholder="" >
            </div>
          </div>
          <div class="info" v-if="keyWordShow"><div class="infoTitle" >关键字:</div><input type="text" v-model="keyWords"><div class="right"></div></div>
          <div class="info"  ><div class="infoTitle " >作者:</div>
            <input type="text" v-model="author"  > <div class="right"></div></div>
          <div class="info infoDown" @click.stop="goOut('1')">
            <div class="infoTitle infoTitle1" >所属单位:</div>
            <div class="right right1 mui-text-center" ><div>{{item.texte}}</div></div>
          </div>

        </div>
        <!--工作地区选择组件-->
        <workCity v-on:Unit="Unit($event)" v-if="!bottomShow" faClass=ulContent2 :outKey=outKey></workCity>
        <div class="bottomShow" v-show="bottomShow">
          <div class="unit" style="position: relative">
            <span @click.stop="prevent1" class="afterShow" v-show="alreadyApply3"> </span>
            <img src="../../assets/img/zengjia.png" alt="" @click="AppendUnit"><div @click="AppendUnit">新增单位</div>
          </div>
          <div class="relative" style="position: relative">
            <span @click.stop="prevent1" class="afterShow" v-show="alreadyApply3"> </span>
            <div class="info infoDown" v-show="AuthorMax>1">
              <div class="infoTitle2">
            <span >
              <input type="checkbox" class="checkbox" v-model="checkbox1" @click.stop="author2_show1" >
            </span>
                <span>第二作者：</span>
              </div>
              <div class="author2-right1" v-show="checkbox1"><input type="text" class="mui-text-center" v-model="AuthorSecend"></div>
              <div class="author2-right2" @click.stop="goOut('2')" v-show="checkbox1"><span >所属单位:&nbsp</span><span>{{item2.texte}}</span></div>
            </div>

            <div class="info infoDown" v-show="checkbox1&&AuthorMax>2">
              <div class="infoTitle2">
            <span>
              <input type="checkbox" class="checkbox" v-model="checkbox2" @click.stop="author2_show2">
            </span>
                <span>第三作者：</span>
              </div>
              <div class="author2-right1" v-show="checkbox2"><input type="text" class="mui-text-center" v-model="Author3"></div>
              <div class="author2-right2" @click.stop="goOut('3')" v-show="checkbox2"><span >所属单位:&nbsp</span><span>{{item3.texte}}</span></div>
            </div>

            <div class="info infoDown" v-show="checkbox2&&AuthorMax>3">
              <div class="infoTitle2" >
            <span>
              <input type="checkbox" class="checkbox " v-model="checkbox3" @click.stop="author3_show11">
            </span>
                <span>第四作者：</span>
              </div>
              <div class="author2-right1" v-show="checkbox3"><input type="text" class="mui-text-center" v-model="Author4"></div>
              <div class="author2-right2" @click.stop="goOut('4')" v-show="checkbox3"><span >所属单位:&nbsp</span><span>{{item4.texte}}</span></div>
            </div>

            <div class="info infoDown" v-show="checkbox3&&AuthorMax>4">
              <div class="infoTitle2" >
            <span>
              <input type="checkbox" class="checkbox" v-model="checkbox4" @click.stop="author4_show1">
            </span>
                <span>第五作者：</span>
              </div>
              <div class="author2-right1" v-show="checkbox4"><input type="text" class="mui-text-center" v-model="Author5"></div>
              <div class="author2-right2" @click.stop="goOut('5')" v-show="checkbox4"><span >所属单位:&nbsp</span><span>{{item5.texte}}</span></div>
            </div>
          </div>


          <div class="info infoDown" @click.stop="periodOut" style="position: relative"><div class="infoTitle" >学段:</div>
            <span @click.stop="prevent1" class="afterShow" v-show="alreadyApply3"> </span>
            <!--<input type="text"><div class="right"></div>-->
            <div class="navLeft input mui-text-center" style="position: relative" @click.stop="periodOut">
              {{period}}
              <div class="period" :style="{display:cur==1?'block':'none'}">
                <ul>
                  <li v-for="(item,index) in periods" :key="index" @click.stop="selectleft(item)">{{item}}</li>
                </ul>
              </div>
            </div>
          </div>
          <div v-show="cur==0">
            <div class="info infoDown" @click.stop="degreeOut" style="position: relative" > <span @click.stop="prevent1" class="afterShow" v-show="alreadyApply3"> </span><div class="infoTitle">学科:</div>
              <!--<input type="text"><div class="right"></div>-->
              <div class="navLeft input mui-text-center" style="position: relative" @click.stop="degreeOut">
                {{Degree}}
                <div class="period" :style="{display:cur1==1?'block':'none'}">
                  <ul>
                    <li v-for="(item,index) in Degrees" :key="index" @click.stop="selectDegree(item)">{{item}}</li>
                  </ul>
                </div>
              </div>
            </div>
            <div v-show="cur1==0">
              <div class="info info-last" style="position: relative">
                <span @click.stop="prevent1" class="afterShow" v-show="alreadyApply3"> </span>
                <div class="infoTitle1">内容简介:</div>
                <textarea id="textarea" v-model="Remark"></textarea>
              </div>
              <div v-show="vedioShow">
                <div class="applyVedio" >
                  <div class="vedioLeft">视频上传： </div>
                  <span class="spanPercent" > {{percentText[0].percentText1}}</span>
                  <!--<span id="btnUpFile1" class="btnUpFile1" v-show="Preview2"></span>-->
                  <div style="display: inline-block">
                    <span class="container" style="margin: 0;padding: 0">
                      <span id="proSampleUpload1" class="upL"></span>
                    </span>
                    <span class="container" v-show="Preview2">
                      <button id="btnSampleUpload1" v-show="Items[0].State === 'Start'"  class="btnUpFile1"></button>
                      <button @click = "doPause(Items[0])" v-show="Items[0].State === 'Pause'">暂停</button>
                      <button @click = "doRestore(Items[0])" v-show="Items[0].State === 'Restore'">继续</button>
                      <button @click = "doClear(Items[0])" v-show="Items[0].State === 'Clear'">清除</button>
                    </span>
                  </div>
                  <i v-show="!Preview2&&!alreadyApply3" style="border-right: 1px solid gainsboro;padding-right: 5px" @click="deletPaper(0)">删除</i> <a @click="windowOpen(src1[0].src)"  class="btnUpFile11" v-show="!Preview2" >预览</a>
                </div>
                <div class="anction">
                  <div class="">1、视频大小不能超过1G，如超过请用视频格式转换软件转成1G以内再上传。</div>
                  <div class="">2、务必确认你的视频文件类型是否是mp4文件,如果是mp4文件则无须转码,直接上传,
                    否则请先转码为mp4格式再上传，转码流程请看[<span><a @click="windowOpen('http://osstest.ezcsoft.com/tzc2/ZcSoft_VideoTo_Mp4_Sample.mp4')"><button class="btnUp" >视频转码演示</button></a></span>]，同时<span class="colorRed">上传成功后先保存再点击预览</span>查看能否播放，若不能播放请重新上传！</div>
                  <div><a href="http://www.pcfreetime.com/formatfactory/CN/index.html"> 使用格式转换工具</a></div>
                </div>
              </div>

              <div v-show="vedioShow">
                <div class="applyVedio" >
                  <div class="vedioLeft">附件上传： </div>
                  <span class="spanPercent"> {{percentText[1].percentText1}}</span>
                  <!--<span id="btnUpFile2" class="btnUpFile1" v-show="Preview"></span>-->
                  <!--<a :href=src1[1].src  class="btnUpFile11" v-show="!Preview">预览</a>-->
                  <div style="display: inline-block">
                    <span class="container" style="margin: 0;padding: 0">
                      <span id="proSampleUpload2" class="upL"></span>
                    </span>
                    <span class="container" v-show="!isRead">
                      <button id="btnSampleUpload2" v-show="Items[1].State === 'Start'" class="btnUpFile1 topUp"><span class="topUp" v-show="upLoadShow"></span></button>
                      <button @click = "doPause(Items[1])" v-show="Items[1].State === 'Pause'">暂停</button>
                      <button @click = "doRestore(Items[1])" v-show="Items[1].State === 'Restore'">继续</button>
                      <button @click = "doClear(Items[1])" v-show="Items[1].State === 'Clear'">清除</button>
                    </span>
                  </div>
                </div>
                <div class="applyVedio1" v-if="alreadyApply" v-for="(item,index) in ossData2" :key="index">
                  <!--<img src="../../assets/img/lw.png" alt="">-->
                  <img :src=item.SUrl alt="">
                  <div class="rightWrapper">
                    <a  @click="windowOpen(item.LUrl)"  style="max-width: 265px;overflow: hidden">名称：{{item.Name}}</a>
                    <div>大小：{{item.FileSize}}</div>
                    <div>类型：{{item.FileType}}</div>
                  </div>
                  <div class="mui-icon mui-icon-trash" @click="delate(ossData2[index])" v-show="!alreadyApply3"></div>
                </div>
              </div>
              <!--==========论文上传=========-->
              <div v-show="!vedioShow">
                <div class="applyVedio" >
                  <div class="vedioLeft">论文上传： </div>
                  <span class="spanPercent" > {{percentText[2].percentText1}}</span>
                  <!--<span id="btnUpFile3" class="btnUpFile1" v-show="Preview2"></span>-->
                  <div style="display: inline-block">
                    <span class="container" style="margin: 0;padding: 0">
                      <span id="proSampleUpload3" class="upL"></span>
                    </span>
                    <span class="container" v-show="Preview2">
                      <button id="btnSampleUpload3" v-show="Items[2].State === 'Start'" class="btnUpFile1"></button>
                      <button @click = "doPause(Items[2])" v-show="Items[2].State === 'Pause'">暂停</button>
                      <button @click = "doRestore(Items[2])" v-show="Items[2].State === 'Restore'">继续</button>
                      <button @click = "doClear(Items[2])" v-show="Items[2].State === 'Clear'">清除</button>
                    </span>
                  </div>
                  <i v-show="!Preview2&&!alreadyApply3" style="border-right: 1px solid gainsboro;padding-right: 5px" @click="deletPaper(1)">删除</i><a @click="windowOpen(src1[1].src)"  class="btnUpFile11" v-if="!Preview2" >预览</a>
                </div>
                <div class="anction">
                  注意：论文上传成功后先保存，再点击预览查看能否预览，若不能预览请重新上传！
                </div>
              </div>

              <div  v-show="alreadyApply2">
                <div class="bind mui-text-center" @click="onSubmit">提交</div>
                <div class="bind mui-text-center bin2" @click="save_paperapply" >保存</div>
              </div>
              <div class="bind mui-text-center falseSubmit bin2" @click="falseSubmit" v-show="alreadyApply3">取消提交</div>
            </div>
          </div>
        </div>
      </div>
    </div>
    <Regist v-if="regist" v-on:registFn="registFn($event)" :isResource=isResource> </Regist>
    <!--错误提醒-->
    <transition name="fade2">
      <Prompt
        :title=mistakeTitle
        :msg=mistakeMsg
        :confirm=mistakeConfirm
        v-on:confirm1="confirm2($event)"
        v-if="mistake"
      >
      </Prompt>
    </transition>
    <!--其他提醒-->

    <remind remindWord="保存成功！" ref="remindSub"> </remind>
    <transition name="fade2">
    <Confirm
      :titleConfirm=titleConfirm
      :msgConfirm=msgConfirm
      v-if="isCofirm"
      v-on:sure="sure($event)"
      v-on:giveUp="giveUp($event)"
    ></Confirm>
    </transition>
  </div>
</template>
<script>
  import heade from '@components/common/head2.vue'
  import inputModel from '@components/common/inputModel.vue'
  import  Prompt from '@components/common/Prompt.vue'
  import  Confirm from '@components/common/Confirm.vue'
  import workCity from './../common/unitSelect'
  import  remind from '@components/common/remind.vue'
  import  Regist from '@components/Regist'
  import OSS from 'ali-oss';
  import {zcServer} from "../../common/js/zcServer";
  import axios from 'axios'
  export default {
    components: {
      heade,
      inputModel,
      Prompt,
      workCity,
      remind,
      Confirm,
      Regist
    },
    data() {
      return {
        keyWordShow: false,
        AuthorMax: 1,
        upLoadShow: false,
        isRead: false,
        showme: true,
        regist: false,
        isResource: true,
        UserId: '',
        change: false,
        titleConfirm: '',
        msgConfirm: '',
        isCofirm: false,
        cofirmNuber: 0,
        mistakeConfirm: '确定',
        mistakeTitle: '错误',
        saveNumber: 0,
        Preview: true,
        Preview2: true,
        outKey: '',
        FileIndex: 1,
        isblack: 0,
        alreadyApply2: true,
        alreadyApply3: false,
        vedioShow: true,
        title: '',
        mistake: false,
        mistakeMsg: '',
        result: [],

        unit: '全部',
        selec: 0,
        item: {},
        item2: {},
        item3: {},
        item4: {},
        item5: {},
        arr: [],
        arr2: [],
        activeName: '',
        activeTitle: '',
        activeTime: '',
        keyWords: '',
        author: '',
        classe: [],
        classe1: [],
        bottomShow: true,
        /*=======作者数据===========*/
        checkbox1: '',
        checkbox2: '',
        checkbox3: '',
        checkbox4: '',
        unit_out: '',
        IsSecendAuthor: false,
        IsAuthor3: false,
        IsAuthor4: false,
        IsAuthor5: false,
        AuthorSecend: '',
        Author3: '',
        Author4: '',
        Author5: '',
        WorkUnitName: '',
        WorkUnitNameSecend: '',
        WorkUnitName3: '',
        WorkUnitName4: '',
        WorkUnitName5: '',
        endTime: '',
        // WorkUnitSN:'',
        date1: '',
        period: '',
        periods: [],
        // lefts:["小学","初中","高中"],
        //lefts:[{Name:"小学"},{Name:"初中"},{Name:"高中"}],
        Degrees: [],
        cur: 0,
        cur1: 0,
        Degree: '',
        change1: '',
        date: null,
        IsSubmit: false,
        //获取全局的laydate，带入到组件中
        laydate: window.laydate,
        ApplyData: {},
        Remark: '',
        Id: 0,
        /*上传*/
        Files: [],
        upsize: '',
        percentText: [{percentText1: ''}, {percentText1: ''}, {percentText1: ''}],
        upLoad: {},
        alreadyApply: '',
        ossData2: [],
        ossDataVideo: {},
        src1: [{src: '', Lurl: ''}, {src: '', Lurl: ''}, {src: '', Lurl: ''}, {src: '', Lurl: ''}],
        plant: 0,
        delateItem: [],
        uesrId: '',
        attrlist: [],
        changeNumber: 0,
        Items: [{
          SN: "AAA",
          FileSN: "",
          name: 1,
          State: "Start",
          ProTagId: 'proSampleUpload1',
          FileCfg: {
            ButtonId: "btnSampleUpload1",
            Accept: "video/mp4;video/quicktime",
            ExtName: ".mov,.mp4",
            MaxSize: "1gb"
          }
        }, {
          SN: "BBB",
          FileSN: "",
          State: "Start",
          name: 2,
          ProTagId: 'proSampleUpload2',
          FileCfg: {
            ButtonId: "btnSampleUpload2",
            Accept: "application/pdf;application/msword;application/vnd.ms-excel;application/vnd.ms-powerpoint;application/vnd.openxmlformats-officedocument.wordprocessingml.document;application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;application/vnd.openxmlformats-officedocument.presentationml.presentation",
            ExtName: ".doc,.docx,.xls,.xlsx,.ppt,.pptx,.pdf",
            MaxSize: "20mb"
          }
        }, {
          SN: "CCC",
          FileSN: "",
          State: "Start",
          name: 3,
          ProTagId: 'proSampleUpload3',
          FileCfg: {
            ButtonId: "btnSampleUpload3",
            Accept: "application/pdf;application/msword;application/vnd.ms-excel;application/vnd.ms-powerpoint;application/vnd.openxmlformats-officedocument.wordprocessingml.document;application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;application/vnd.openxmlformats-officedocument.presentationml.presentation",
            ExtName: ".doc,.docx",
            MaxSize: "20mb"
          }
        }],
      }
    },
    created() {
      let now = new Date();
      this.date1 = now.toLocaleDateString();
      let year = this.date1.split('/')[0];
      let month = this.date1.split('/')[1];
      let day = this.date1.split('/')[2];
      if (month < 10) {
        month = '0' + month
      }
      if (day < 10) {
        day = '0' + day
      }
      this.date = year + '-' + month + '-' + day;
      let me = this;
      me.ApplyData = JSON.parse(sessionStorage.getItem("ApplySN"));
      //me.WorkUnitSN =localStorage.getItem('WorkUnitSN')
      console.log(me.ApplyData.ProjectType)
      /*判断进入页面的事优秀论文还是课列以及是否已经提交*/
      // if(me.ApplyData.isCanWrite==false){
      //   me.alreadyApply2=false
      // }
      if (me.ApplyData.ProjectType.indexOf('优秀论文') >= 0) {
        me.title = '优秀论文申报填写';
        me.vedioShow = false
      }
      if (me.ApplyData.ProjectType.indexOf('优秀课例评选') >= 0) {
        me.title = '优秀课例评选申报填写'
      }
      if (me.ApplyData.ProjectType.indexOf('优质课展评') >= 0) {
        me.title = '优质课展评申报填写'
      }

      me.activeName = me.ApplyData.Name;
      console.log(me.ApplyData);

      /*申报详细信息*/
      me.$Global.zcServer.Post({
        IsNeedLogin: 'true',
        Paras: {
          UserId: me.$Global.UserId,
          Name: 'Vue_CourseResource',
          action: 'Ext_ResourceApplyInfo',
          Data: {
            ProjectResourceSN: me.ApplyData.SN,
            // SN:me.ApplyData.SN
          }
        },
        Callback: me.cb_ApplyDetail2,
        Scope: me,
      });
      /*是否可以申报*/
      me.$Global.zcServer.Post({
        IsNeedLogin: 'true',
        Paras: {
          UserId: me.$Global.UserId,
          Name: 'Vue_CourseResource',
          action: "Ext_ProjectApply_WriteContral",
          Data: {
            SN: me.ApplyData.SN
          }
        },
        Callback: me.cb_ApplyDetail3,
        Scope: me,
      });
      /*距离申报结束几天*/
      me.$Global.zcServer.Post({
        IsNeedLogin: 'true',
        Paras: {
          UserId: me.$Global.UserId,
          Name: 'Vue_CourseResource',
          action: 'Ext_ProjectResourceInfo',
          Data: {
            SN: me.ApplyData.SN,
            // SN:me.ApplyData.SN
          }
        },
        Callback: me.cb_ApplyDetail5,
        Scope: me,
      });

    },
    computed: {
      attrlistData() {

        let me = this;
        let attrlist = {};
        attrlist.ProjectResourceName = me.activeName;
        attrlist.ProjectResourceSN = me.ApplyData.SN;
        attrlist.Id = me.Id;
        attrlist.Title = me.activeTitle;
        attrlist.FillDate = me.date;
        attrlist.Keywords = me.keyWords;
        attrlist.Author = me.author;
        attrlist.WorkUnitName = me.item.texte;
        attrlist.WorkUnitSN = me.WorkUnitSN;
        attrlist.LearnStage = me.period;
        attrlist.Subject = me.Degree;
        attrlist.Remark = me.Remark;
        attrlist.Files = me.ossData2;
        attrlist.PB_ComAttSN = me.ossDataVideo.SN;
        attrlist.TS = me.ApplyData.TS;
        if (me.checkbox1 == true) {
          me.IsSecendAuthor = true;
          attrlist.AuthorSecend = me.AuthorSecend;
        }
        if (me.checkbox2 == true) {
          me.IsAuthor3 = true;
          attrlist.Author3 = me.Author3;
        }
        if (me.checkbox3 == true) {
          attrlist.Author4 = me.Author4;
          me.IsAuthor4 = true;
        }
        if (me.checkbox4 == true) {
          me.IsAuthor5 = true;
          attrlist.Author5 = me.Author5;
        }
        attrlist.IsSecendAuthor = me.IsSecendAuthor;
        attrlist.WorkUnitNameSecend = me.item2.texte;
        attrlist.WorkUnitName3 = me.item3.texte;
        attrlist.IsAuthor3 = me.IsAuthor3;
        attrlist.WorkUnitName4 = me.item4.texte;
        attrlist.IsAuthor4 = me.IsAuthor4;
        attrlist.WorkUnitName5 = me.item5.texte;
        attrlist.IsAuthor5 = me.IsAuthor5;
        // this.attrlist=attrlist
        return attrlist;
      }
    },
    methods: {
      prevent1() {
      },
      /*判断页面是否改动=======*/
      def_bodyClick() {
        this.cur = 0
        this.cur1 = 0
      },
      windowOpen(index) {
        window.open(index)
      },
      test() {
        this.change = true
      },
      delate(index1) {
        if (this.IsSubmit == false) {
          this.delateItem = index1;
          this.cofirmNuber = 1;
          this.isCofirm = true;
          this.msgConfirm = '确定要删除？';
          this.titleConfirm = '温馨提示'
        } else {
          this.cofirmNuber = 1;
          this.isCofirm = true;
          this.msgConfirm = '已经提交不可删除！';
          this.titleConfirm = '温馨提示'
        }

      },
      deletPaper(index) {
        if (this.IsSubmit == false) {
          this.cofirmNuber = 5;
          this.isCofirm = true;
          this.msgConfirm = '确定要删除？';
          this.titleConfirm = '温馨提示'
        } else {
          this.cofirmNuber = 5;
          this.isCofirm = true;
          this.msgConfirm = '已经提交不可删除！';
          this.titleConfirm = '温馨提示'
        }

      },
      AppendUnit() {
        this.$router.push("AppendUnit")
      },
      confirm2() {
        this.mistake = false;
      },
      registFn(regist2) {
        this.regist = !regist2;
        this.isResource = true;
        console.log('regist2', regist2)
        //this.$router.go(0)
        window.location.reload()

      },

      /*回调函数*/
      cb_ApplyDetail(resJson, scope) {
        console.log('申请进度')
        console.log(resJson)
        try {
          if (resJson.success) {
            this.result = resJson.data
            this.result.forEach((item) => {
              if (item.Date == '') {
                item.Date = '请等待...'
              }
            })
          }
        } catch (e) {
          // alert(e)
        }

      },

      cb_ApplyDetail2(resJson, scope) {
        try {
          let me = this;
          console.log("关键数据");
          console.log(resJson);
          let data = resJson.data[0];
          if (data.FillDate) {
            me.date = data.FillDate
          }
          me.WorkUnitSN = data.WorkUnitSN;
          me.Id = data.Id;
          me.activeTitle = data.Title;
          me.keyWords = data.Keywords;
          me.Remark = data.Remark;
          me.period = data.LearnStage;
          me.Degree = data.Subject;
          if (data.IsSecendAuthor == 'true') {
            me.item2.texte = data.WorkUnitNameSecend;
            me.AuthorSecend = data.AuthorSecend;
            if ((me.item2.texte != '' || me.AuthorSecend != '') && (me.item2.texte != null || me.AuthorSecend != null)) {
              me.checkbox1 = true
            }
          } else {
            me.AuthorSecend = '';
            me.item2.texte == ''
          }
          if (data.IsAuthor3 == 'true') {
            me.item3.texte = data.WorkUnitName3;
            me.Author3 = data.Author3;
            if (me.item3.texte != '' || me.Author3 != '' && (me.item3.texte != null || me.Author3 != null)) {
              me.checkbox2 = true
            }
          } else {
            me.Author3 = '';
            me.item3.texte = ''
          }
          if (data.IsAuthor4 == 'true') {
            me.item4.texte = data.WorkUnitName4;
            me.Author4 = data.Author4;
            if ((me.item4.texte != '' || me.Author4 != '') && (me.item4.texte != null || me.Author4 != null)) {
              me.checkbox3 = true
            }
          } else {
            me.item4.texte = "";
            me.checkbox3 = ""
          }
          if (data.IsAuthor5 == 'true') {
            me.Author5 = data.Author5;
            me.item5.texte = data.WorkUnitName5;
            if ((me.item5.texte != '' || me.Author5 != '') && (me.item5.texte != null || me.Author5 != null)) {
              me.checkbox4 = true
            }
          } else {
            me.Author5 = ''
            me.item5.texte = ''
          }
          me.item.texte = data.WorkUnitName;
          me.author = data.Author;
          me.Files = data.Files;
          me.ApplyData.TS = data.TS;
          me.ApplyData.SN2 = data.SN;
          /*展示附件列表*/

          if (data.Files != '') {
            // console.log(data.Files.length)
            me.percentText[1].percentText1 = '继续上传';
            for (let i = 0; i < data.Files.length; i++) {
              let ossData = {};
              me.alreadyApply = true;
              ossData.ProjectResourceSN = this.ApplyData.SN;
              ossData.PB_ComAttSN = data.Files[i].PB_ComAttSN;
              ossData.Name = data.Files[i].File.FileName;
              ossData.FileType = data.Files[i].File.FileType;
              ossData.FileSize = data.Files[i].File.FileSize;
              ossData.LUrl = data.Files[i].File.LUrl;
              ossData.SUrl = data.Files[i].File.SUrl;
              me.ossData2.push(ossData)
            }
            console.log('视频或则论文');
            console.log(data.File);
          } else {
            me.alreadyApply2 = true;
            me.Preview = true;
          }
          this.$nextTick(() => {
            if (data.File) {
              me.Preview2 = false;
              me.percentText[0].percentText1 = data.File.FileName;
              me.percentText[2].percentText1 = data.File.FileName;
              me.src1[0].src = data.File.LUrl;
              me.src1[1].src = data.File.LUrl;
            } else {
              me.Preview2 = true;
              me.percentText[0].percentText1 = '未上传视频';
              me.percentText[2].percentText1 = '未上传论文';
            }

          })
          console.log('是提交')
          console.log(data.IsSubmit)
          if (data.IsSubmit === 'true') {
            me.percentText[1].percentText1 = '已经提交不可再上传';
            me.IsSubmit = true;
            me.upLoadShow = true;
            me.alreadyApply2 = false;
            me.alreadyApply3 = true;
            // me.Preview=false;
            me.$Global.zcServer.Post({
              IsNeedLogin: 'true',
              Paras: {
                UserId: me.$Global.UserId,
                Name: 'Vue_CourseResource',
                action: "Ext_EvaluationCollection",
                Data: {
                  ProjectResourceSN: me.ApplyData.SN,
                  ResourceApplySN: me.ApplyData.SN2,
                }
              },
              Callback: me.cb_ApplyDetail,
              Scope: me,
            });
            me.title = me.title.split('申报')[0] + '申报详情'
          } else {
            me.alreadyApply2 = true;
            me.Preview = true;
            this.Preview2 = true
          }
          if (me.author == null) {
            me.author = localStorage.getItem("myName");
          }
          if (me.item.texte == null) {
            // me.author=localStorage.getItem("myName");
            me.item.texte = localStorage.getItem("WorkUnitName");
            me.WorkUnitSN = localStorage.getItem("WorkUnitSN");
          }
        } catch (e) {
          // alert(e)
        }

      },
      /*是否课申报*/
      cb_ApplyDetail3(resJson, scope) {
        console.log('是否可以申报');
        console.log(resJson)
        if (resJson.success == false) {

          if (resJson.msg.indexOf("PleaseRegistry" >= 0)) {
            this.isCofirm = true;
            this.titleConfirm = '温馨提示'
            this.msgConfirm = '请注册并登陆后再填报！'
            this.cofirmNuber = 3
          }
        }
        this.$nextTick(() => {
          this.showme = false
        })
      },
      /*距离申报结束*/
      cb_ApplyDetail5(resJson, scope) {

        console.log('距离结束');
        console.log(resJson.data)
        if(!resJson.success){
          // this.mistake=true;
          // this.mistakeMsg=resJson.msg
        }else {
          this.endTime = resJson.data.dqdate
          if (resJson.data.ProjectType.indexOf('优秀论文') >= 0) {
            this.title = '优秀论文申报填写';
            this.vedioShow = false
          }
          if (resJson.data.ProjectType.indexOf('优秀课例评选') >= 0) {
            this.title = '优秀课例评选申报填写'
          }
          if (resJson.data.ProjectType.indexOf('优质课展评') >= 0) {
            this.title = '优质课展评申报填写';
            this.keyWordShow = false
          } else {
            this.keyWordShow = true
          }
          let periods1 = resJson.data.SelectLearnStage.split(',')
          let Degrees1 = resJson.data.SelectSubjects.split(',')
          this.$nextTick(() => {
            periods1.forEach((item, index) => {
              // this.periods.push(item)
              this.$set(this.periods, index, item)
            });
            Degrees1.forEach((item) => {
              this.Degrees.push(item)
            })
            if (this.period == null) {
              this.period = this.periods[0]
            }
            if (this.Degree == null) {
              this.Degree = this.Degrees[0]
            }
            this.AuthorMax = resJson.data.AuthorMax
          })
        }

      },
      /*保存回调函数*/
      cb_save_paperapply(resJson, scope) {
        console.log("保存返回");
        console.log(resJson)
        let me = this
        if (resJson.success == true) {
          me.saveNumber = 0
          me.ApplyData.TS = resJson.data.TS
          me.changeNumber = 0
          me.change = false
          me.$refs.remindSub.test()

          setTimeout(() => {
            //me.$router.go(0)
            window.location.reload()
          }, 500)

        }
        else {
          if (resJson.msg.indexOf("PleaseRegistry") >= 0) {
            me.cofirmNuber = 3
            me.isCofirm = true;
            me.titleConfirm = '温馨提示'
            me.msgConfirm = '请注册并登陆后再填报！'
          } else {
            me.mistake = true;
            me.mistakeMsg = resJson.msg
          }
        }
      },
      /*提交回调函数*/
      cb_onSubmit(resJson, scope) {
        console.log("提交返回");
        console.log(resJson)
        if (resJson.success == false) {

          if (resJson.msg.indexOf("PleaseRegistry") >= 0) {
            this.cofirmNuber = 3
            this.isCofirm = true;
            this.titleConfirm = '温馨提示'
            this.msgConfirm = '请注册并登陆后再填报！'
          } else {
            this.cofirmNuber = 0
            this.mistake = true;
            this.mistakeMsg = resJson.msg
          }
        } else {
          window.location.reload()
        }
      },
      /*取消提交回调============================*/
      cb_falseSubmit(resJson, scope) {
        console.log('取消提交')
        console.log(resJson)
        if (resJson.success == true) {
          this.Preview2 = true
          //this.$router.go(0)
          window.location.reload()
        } else {
          this.mistake = true;
          this.mistakeMsg = resJson.msg
        }
      },
      goBack() {
        // this.$router.push('/Index')
        this.$router.go(-1)
      },
      /*提交*/
      onSubmit() {
        let me = this;
        if (this.keyWordShow == true) {
          if (this.attrlistData.Keywords == '' || this.attrlistData.Keywords == null) {
            this.mistake = true;
            this.mistakeMsg = '请输入关键字！'
            return
          }
        }
        if (this.keyWordShow == true) {
          if (this.attrlistData.Remark == '' || this.attrlistData.Remark == null) {
            this.mistake = true;
            this.mistakeMsg = '请输入内容简介！'
            return
          }
        }
        if (me.change == true) {
          me.mistake = true;
          me.mistakeTitle = '温馨提示'
          me.mistakeMsg = '请先保存再提交'
          return
        }
        if (me.changeNumber == 1) {
          me.mistake = true;
          me.mistakeTitle = '温馨提示'
          me.mistakeMsg = '请先保存再提交'
          //me.changeNumber=0
          return
        }
        //alert(this.attrlistData.Author)
        if (me.attrlistData.Author == '' || me.attrlistData.Author == null) {
          me.mistake = true;
          me.mistakeMsg = '申报作者不能为空!'
          return
        }
        if (me.attrlistData.WorkUnitName == '' || me.attrlistData.WorkUnitName == null) {
          me.mistake = true;
          me.mistakeMsg = '申报作者单位不能为空!'
          return
        }
        me.$Global.zcServer.Post({
          IsNeedLogin: 'true',
          Paras: {
            UserId: me.$Global.UserId,
            Name: 'Vue_CourseResource',
            action: "Ext_ResourceApplySubmit",
            Data: {
              TS: me.ApplyData.TS,
              SN: me.ApplyData.SN2
            }
          },
          Callback: me.cb_onSubmit,
          Scope: me,
        });
      },
      /*取消提交*/

      falseSubmit() {
        let me = this;
        me.isCofirm = true;
        me.titleConfirm = '温馨提示'
        me.msgConfirm = '在申报期内取消提交后可更改内容再次提交！'
        me.cofirmNuber = 0
      },
      sure() {

        let me = this
        me.isCofirm = false
        /*0取消提交调用，1代表删除附件调用，3代表注册信息调用*/
        if (me.cofirmNuber == 0) {

          me.$Global.zcServer.Post({
            IsNeedLogin: 'true',
            Paras: {
              UserId: me.$Global.UserId,
              Name: 'Vue_CourseResource',
              action: 'Ext_ResourceApplyUpdoSubmit',
              Data: {
                SN: me.ApplyData.SN2,
              }
            },
            Callback: me.cb_falseSubmit,
            Scope: me,
          });
        }
        if (me.cofirmNuber == 1) {
          if (me.IsSubmit == true) {
            return
          }
          for (let i = 0; i < this.ossData2.length; i++) {
            if (this.ossData2[i] == this.delateItem) {
              this.ossData2.splice(i, 1)
            }
          }
        }
        if (me.cofirmNuber == 3) {
          // me.$router.go(0)
          me.regist = true;
          // me.$router.push('/Regist')
        }
        if (me.cofirmNuber == 5) {
          if (me.IsSubmit == true) {
            return
          }
          this.percentText[0].percentText1 = '';
          this.percentText[2].percentText1 = '';
          this.Preview2 = true;
          me.ossDataVideo.SN = ''
        }
      },
      giveUp() {
        // alert(2)
        this.isCofirm = false
      },
      /*保存*/
      save_paperapply() {
        let me = this;
        me.saveNumber++;
        me.$Global.zcServer.Post({
          IsNeedLogin: 'true',
          Paras: {
            UserId: me.$Global.UserId,
            Name: 'Vue_CourseResource',
            action: "Ext_ResourceApplySave",
            Data: me.attrlistData
          },
          Callback: me.cb_save_paperapply,
          Scope: me
        });

      },
      /*所属单位联动函数*/
      goOut(index) {
        this.outKey = index;//给子组件参数做判断
        this.bottomShow = false
      },

      /*接受子组件传过来的参数判断是父组件那个函数调用*/
      Unit(change) {
        this.changeNumber = 1;
        if (change.outKey == 1) {
          this.item.texte = change.WorkUnit
          this.attrlist.WorkUnitName = this.item.texte
          this.WorkUnitSN = change.WorkUnitSN
        }
        if (change.outKey == 2) {
          this.item2.texte = change.WorkUnit
        }
        if (change.outKey == 3) {
          this.item3.texte = change.WorkUnit
        }
        if (change.outKey == 4) {
          this.item4.texte = change.WorkUnit
        }
        if (change.outKey == 5) {
          this.item5.texte = change.WorkUnit
        }
        this.bottomShow = true
      },
      /*作者二后面信息是否显示*/
      author2_show1() {
        this.checkbox1 = false;
        this.checkbox2 = false;
        this.checkbox3 = false;
        this.checkbox4 = false;
        this.IsSecendAuthor = !this.IsSecendAuthor
      },
      /*作者三后面信息是否显示*/
      author2_show2() {
        this.checkbox2 = false;
        this.checkbox3 = false;
        this.checkbox4 = false;
      },
      /*作者四后面信息是否显示*/
      author3_show11() {
        this.checkbox3 = false;
        this.checkbox4 = false;

      },
      /*作者四后面信息是否显示*/
      author4_show1() {
      },
      /*学段下拉菜单*/
      periodOut() {
        this.cur = !this.cur;
        console.log(this.periods)

      },
      selectleft(item) {
        let me = this
        me.period = item;
        me.attrlist.LearnStage = me.period;
        me.changeNumber = 1;
        console.log(me.attrlist)
        me.cur = !me.cur;

      },
      /*学位下拉菜单*/
      degreeOut() {
        this.cur1 = !this.cur1;
      },
      selectDegree(item) {
// alert(num.Name)
        this.Degree = item;
        this.changeNumber = 1;
        this.cur1 = !this.cur1
      },
      /*=============上传文件=======================*/

      /*视频=======*/
      doPause(item) {
        let me = this;
        //item.State = "Restore";
        me.$nextTick(function () {
          //item.Uploader.Client.cancel();
          me.$Global.zcAliFile.doPause({
            State: 'Restore',
            UserData: item,
            fnChangeState: me.cbChangeState,
            fnUpingError: me.cbUpingError,
            Scope: me
          });
        });
      },
      doRestore(item) {
        let me = this;
        //item.State = "Pause";
        me.$nextTick(function () {
          me.$Global.zcAliFile.doNormRestore({
            State: 'Pause',
            UserData: item,
            fnUpingProgress: me.cbUpingProgress,
            fnUpingSuccess: me.cbUpingSuccess,
            fnUpingError: me.cbUpingError,
            fnChangeState: me.cbChangeState,
            Scope: me
          });
        });
      },
      doClear(item) {
        let me = this;
        item.State = "Start";
        item.FileSN = "";
        item.Uploader.ProgTag.innerText = "";
      },
      doInitUp() {
        let me = this;
        // 调用上传-开始
        me.Items.forEach((item, index) => {
          item.Uploader = {};
          item.Uploader.ProgTag = document.getElementById(item.ProTagId);
          me.$Global.zcAliFile.doInit({
            AliOss: OSS,
            UserData: item,
            FileCfg: item.FileCfg,
            fnFileAdded: me.cbFileAdded,
            fnUpingProgress: me.cbUpingProgress,
            fnUpingSuccess: me.cbUpingSuccess,
            fnUpingError: me.cbUpingError,
            fnChangeState: me.cbChangeState,
            Scope: me
          });
        })

        // 调用上传
      },
      /*==============上传回调===========*/
      cbFileAdded(options) {
        this.upLoadShow = true;
        options.UserData.State = "Pause";
      },
      cbUpingProgress(percent, options) {
        options.UserData.Uploader.ProgTag.innerText = "" + percent + "%";
      },
      cbUpingSuccess(resJson, options) {
        console.log(options)
        console.log('上传完成-结果', resJson);
        // console.log('上传完成-结果',resJson.data.LUrl);
        this.changeNumber = 1;
        if (!resJson.success) {
          this.mistake = true;
          this.mistakeMsg = resJson.msg
          if (options.UserData.name == 3 || options.UserData.name == 1) {
            this.percentText[2].percentText1 = '';
            this.percentText[0].percentText1 = '';
          } else {
            this.percentText[1].percentText1 = '';
          }
        }
        if (resJson.success) {
          this.upLoadShow = false;
          if (options.UserData.name == 3 || options.UserData.name == 1) {
            this.Preview2 = false;
            this.ossDataVideo.Name = resJson.data.FileName;
            this.ossDataVideo.FileType = resJson.data.FileType;
            this.ossDataVideo.FileSize = resJson.data.FileSize;
            this.ossDataVideo.LUrl = resJson.data.LUrl;
            this.ossDataVideo.SUrl = resJson.data.SUrl;
            this.ossDataVideo.ProjectResourceSN = this.ApplyData.SN;
            this.ossDataVideo.SN = resJson.data.SN;
            this.percentText[2].percentText1 = resJson.data.FileName;
            this.percentText[0].percentText1 = resJson.data.FileName;
            this.src1[0].src = this.src1[1].src = resJson.data.LUrl
          }
          if (options.UserData.name == 2) {
            options.UserData.State = "Start";
            console.log(resJson)
            let ossData = {};
            this.alreadyApply = true;
            ossData.ProjectResourceSN = this.ApplyData.SN;
            ossData.PB_ComAttSN = resJson.data.SN;
            ossData.Name = resJson.data.FileName;
            ossData.FileType = resJson.data.FileType;
            ossData.FileSize = resJson.data.FileSize;
            ossData.LUrl = resJson.data.LUrl;
            ossData.SUrl = resJson.data.SUrl;
            this.ossData2.push(ossData)
          }
        }
        options.UserData.Uploader.ProgTag.innerText = "";
        options.UserData.State = "Start";
      },
      cbChangeState(options) {
        if (options.State === 'Pause') {
          options.UserData.State = "Pause";
        }
        if (options.State === 'Restore') {
          options.UserData.State = "Restore";
        }
      },
      cbUpingError(err, options) {
        console.log('cbUpingError-err', err);
        if (err.errCode == 'errFileSize' || err.errCode == "errFileType" || err.errCode == "errUnKnow") {
          this.mistake = true;
          this.mistakeMsg = err.msg
        }
        let me = this
        if (err.errCode == "errLessTime") {
          // me.toastShow=true;
          // setTimeout(()=>{
          //   me.toastShow=false
          // },300)
        }
      },

    },
    mounted() {
      this.laydate.render({
        elem: '#test',
        done: (value) => {
          this.date = value
        }
      });
      let me = this;
      me.doInitUp();
      console.log(this.changeNumber)
      console.log(this.attrlist)
      //alert(this.periods.length)
    },
    watch: {
      "attrlist.LearnStage": {
        handler(newItem, oldItem) {
          console.log(newItem);
          console.log("5446556");
          console.log(oldItem);
          this.changeNumber = 1
        },
        deep: true
      },
      "attrlist.Subject": {
        handler(newItem, oldItem) {
          console.log(newItem);
          console.log("54465567867867");
          console.log(oldItem);
          this.changeNumber = 1
        },
        deep: true
      }
    }
  }
</script>
<style scoped>
  /*进入页面动画*/
  #Loading {
    top:50%;
    left:50%;
    position: absolute;
    -webkit-transform: translateY(-50%)  translateX(-50%);
    transform: translateY(-50%)  translateX(-50%);
    z-index:100;
  }
  @-webkit-keyframes ball-beat {
    50% {
      opacity: 0.2;
      -webkit-transform: scale(0.75);
      transform: scale(0.75);
    }

    100% {
      opacity: 1;
      -webkit-transform: scale(1);
      transform: scale(1); }
  }

  @keyframes ball-beat {
    50% {
      opacity: 0.2;
      -webkit-transform: scale(0.75);
      transform: scale(0.75);
    }

    100% {
      opacity: 1;
      -webkit-transform: scale(1);
      transform: scale(1); }
  }

  .ball-beat > div {
    background-color: #279fcf;
    width: 15px;
    height: 15px;
    border-radius: 100% !important;
    margin: 2px;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: inline-block;
    -webkit-animation: ball-beat 0.7s 0s infinite linear;
    animation: ball-beat 0.7s 0s infinite linear; }
  .ball-beat > div:nth-child(2n-1) {
    -webkit-animation-delay: 0.35s !important;
    animation-delay: 0.35s !important;
  }
  /*  =====头部申请情况========*/
  .mui-content .titleWrapper ul{
    margin-top: 10px;
  }
  .mui-content .titleWrapper ul li{
    display: flex;
    width: 100%;
    background-color: white;
    height: 50px;
    line-height: 50px;
    color:grey;
    font-size: 14px;
  }
  .mui-content .titleWrapper ul li .left{
    /*width: 10%;*/
    flex:  0 0 40px;
    position: relative;
  }
  .mui-content .titleWrapper ul li .left .span{
    display: inline-block;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background-color:rgba(93, 194, 240, 1);
    position: absolute;
    left: 12px;
    top: 19px;
    z-index: 2;
  }
  .mui-content .titleWrapper ul li .left  .span2{
    position: absolute;
    width: 1px;
    height: 50px;
    background-color:rgba(178, 215, 234, 1);
    left: 18px;
    top:20px;

    z-index: 1;
  }
  .mui-content .titleWrapper ul li .middle{
    width: 20%;
  }
  .mui-content .titleWrapper ul li .right{
    width: 45%;
  }

  /*---------------------------------------------*/
  .mui-content .hello{
    background-color: white;
    /*height: ;*/
    width: 70%;
  }
  #test{
    border: none;
    height: 35px;
    line-height: 35px;
    width: 70%;
    font-size: 0.9rem;
    background-color: white;
    padding: 0px;
    margin-top: -1px;
  }
  .mui-content input{
    font-size: 0.9rem;
  }
  .mui-content .time{
    height: 50px;
    line-height: 50px;
    padding-left: 2%;
  }
  .mui-content .time span{
    color:rgb(250,170,110) ;
    font-size: 1.1rem;
  }
  .mui-content form{
    padding-bottom: 10%;
  }
  .mui-content .ulContent{
    position: relative;
  }
  .mui-content .info{
    height: 40px;
    line-height: 40px;
    background-color: white;
    border-bottom: 1px solid gainsboro;
    padding-left: 2%;
    display: flex;
  }
  .mui-content .infoDown{
    background-image: url("../../assets/img/jiantou.png") ;
    background-repeat:no-repeat;
    background-position: 95% ;
  }
  .mui-content .info .infoTitle{
    flex: 0 0 66px;
    font-size: 14px;
  }
  .mui-content .info-last{
    border-bottom: none;
    height: 85px;
    background-color: white;
    padding-bottom: 10px;
  }
  .mui-content .info .infoTitle1 {
    flex: 0 0 66px;
    /*width: 18%;*/
    font-size: 14px;
    /*text-align: right;*/
    border-bottom: none;
  }
  .mui-content .info .infoTitle .checkbox{
    display: inline-block !important;
    width: 150px !important;
    height: 150px !important;
    /*padding-top: 50px;*/
    /*line-height: 20px;*/
    position: relative !important;
    top: 20px !important;

  }
  .mui-content .info input{
    width: 70%;
    border: none;
    height: 28px;
    line-height: 28px;
    margin-top: 6px;
    padding-left: 1px;

  }
  .mui-content .info .input{
    width: 70%;
    border: none;
    height: 28px;
    line-height: 28px;
    margin-top: 6px;
    padding-left: 1px;
    font-size: 0.9rem;
  }
  .mui-content .info .right{
    width: 8%;
  }
.mui-content .info .right1{
  /*width: 100%;*/
  text-align: center;
  /*z-index: 99;*/
  overflow: hidden;
  -webkit-line-clamp:1;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}
  .mui-content .info .right1 div{
    -webkit-line-clamp: 1;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
  }

  .mui-content .info .right2{
    width: 30%;
  }
.mui-content .info1{
  width: 100%;
  /*z-index: 999;*/
  position: absolute;
 top:38px;
  padding-bottom:100%;
}
.mui-content .info1 .right1 ul{
  /*margin-top: 38px;*/
  display: inline-block;
  float: left;
  width: 33%;
  overflow: hidden;
  background-color: rgba(93, 194, 240, 1);
  color: white;
  border-right: 1px solid white;

}
.mui-content .info1 .right1 ul li {
  height: 38px;
  line-height: 38px;
  overflow: hidden;
  background-color: white;
  color: grey;
  /*border-bottom: 1px solid rgba(93, 194, 240, 1);*/
}
  .mui-content  .unit{
    height: 50px;
    padding: 5% ;
  }
  .mui-content  .unit *{
    font-size: 0.95rem;
    float: left;
    display: inline-block;
    padding-right: 8px;
    color: rgb(75, 173, 240);

  }
  .mui-content  .unit img{
    width: 25px;
    height: 18px;
    background-size: 20px 20px;
  }
  .mui-content .anction{

    padding:3% 2% ;
    font-size: 14px;
    color: #8f8f94;
  }
  #textarea{
    width:80%;
    min-height:70px;
    margin-bottom: 0px;
    padding: 3px;
    border: none;
    outline: 0;
    font-size: 14px;
    line-height: 24px;
    margin-top: 5px;
  }

  .mui-content .applyVedio img{
    margin-right: 5%;
    float: right;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-top: 10px;
  }

  .mui-content .bind{
    width: 88%;
    height: 40px;
    background-color:rgba(93, 194, 240, 1);
    color: white;
    margin:  auto;
    line-height: 40px;
    margin-top: 30px;
    border: none;
    border-radius: 4px;

  }
  .mui-content .bin2{
    border:1px solid rgba(93, 194, 240, 1);
    color: rgba(93, 194, 240, 1);
    background-color:white;
    margin-bottom: 2rem;
  }
.mui-content .info1 .right1 ul>.active{
  background-color: rgba(93, 194, 240, 1);
  color: white;
}
  .mui-content .info .infoTitle2{
   width: 5.8rem;
    font-size: 14px;
}
  .mui-content .info .author2-right1{
    font-size: 0.8rem;
    width: 4.7rem;
  }
  .mui-content .info .author2-right1 input{
    margin: 0;
    padding: 0;
    font-size: 0.8rem;
    width: 100%;
    height: 28px;
    line-height: 22px;
    border: 1px solid rgba(93, 194, 240, 1);
  }
  .mui-content .info .author2-right2{
    margin-left: 10px;
    font-size: 0.8rem;
    width: 50%;height: 2.5rem;
    line-height: 2.5rem;
    /*border: 1px solid blue;*/
    position: relative;
    overflow: hidden;
    /*display: flex;*/

  }
  .mui-content .info .author2-right2 span:first-child{
    display: inline-block;
    width: 60px;
    /*flex: 0 0 60px;*/
    position: absolute;
  }

  .mui-content .info .author2-right2 span:last-child{
    height: 28px;
    vertical-align: middle;
    -webkit-line-clamp:1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    position: absolute;
    left: 60px;
    top: 6px;
    border-radius: 2px;
    line-height: 28px;
  }
  .mui-content .info .infoTitle2 .checkbox{
    width: 18px;
    height: 15px;
    background-color: #007aff;
  }
  .mui-content .info .right1{
    display: inline-block;
    width: 70%;
    text-align: center;
    font-size: 0.9rem;
  }

  .mui-content .applyVedio{
    width: 100%;
    height: 2.5rem;
    font-size: 14px;
    line-height: 40px;
    /*color: #8f8f94;*/
    background-color: white;
    margin-top: 10px;
    display: flex;
  }
  .mui-content .applyVedio .vedioLeft{
    padding-left: 2%;
    /*text-align: right;*/
    /*padding-right: 10%;*/
    width: 22%;
  }
  .mui-content .applyVedio .btnUpFile1{
    display: inline-block;
    /*float: right;*/
    /*margin-right: 25px;*/
    height: 25px;
    width: 30px;
    background: url("../../assets/img/shangchuan.png") no-repeat !important;
    background-size: 20px 20px !important;


  }
  .mui-content .applyVedio .btnUpFile11{
    margin-left: 5px;
  }
  .mui-content .applyVedio .spanPercent{
    text-align: center;
    width: 50%;
    /*background-color: #5FB878;*/
    vertical-align: middle;
    -webkit-line-clamp:1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
    padding-right:2% ;
  }

  .mui-content .applyVedio1{
    display: flex;
    width: 100%;
    padding: 5%;
    background-color: white;
    margin-top: 10px;
  }
  .mui-content .applyVedio1 img{
    flex: 0 0 60px;
    width: 3.1rem;
    height: 4rem;
  }
  .mui-content .applyVedio1 .rightWrapper{
    flex: 1;
    margin-left: 3%;
    font-size: 14px;
    /*max-width: 265px;*/
    overflow: hidden;

    /*overflow: hidden;*/
  }
  .mui-content .applyVedio1 .rightWrapper a {
    display: inline-block;
    min-width: 250px;
    /*-webkit-line-clamp:1;*/
    /*display: -webkit-box;*/
    /*-webkit-box-orient: vertical;*/
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .mui-content .applyVedio1 .mui-icon{
    flex: 0 0 5px;
    float: right;
  }
  /*上传文件列表*/
.mui-content .applyVedio{}

  .mui-content .applyVedio img{
    margin-right: 5%;
    float: right;
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-top: 10px;
  }
  .container button{
    border:none;
    padding: 0;
    margin-top: 10px;
    width: 30px;
    height: 20px;
  }
  .upL{
    display: inline-block;
    width: 30px;
    height: 20px;
    /*border:1px solid red;*/
    /*margin-top: 5px;*/

  }
  .btnUp{
    border: none;
    outline: none;
    padding: 0;
    margin: 2px;
    color: #3ba0f0;
  }
  .topUp{
    width: 29px;
    height: 25px;
    display: inline-block;
    /*border: 1px solid red;*/
    /*margin-left: -1px;*/
  }
  .period{
    position: absolute;
    width: 100%;
    top:40px
  }
  .afterShow{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /*background-color: #007aff;*/
    z-index: 999;
  }
  .colorRed{
    color: red;
  }
/*  彈出框*/
  .fade2-enter-active {
    transition: opacity .4s;
  }
  .fade2-leave-active{
    transition: opacity .1s;
    }
  .fade2-enter, .fade2-leave-to {
    opacity: 0;
  }
  .fade2-enter-to, .fade2-leave {
    opacity: 1;
  }
</style>
